<template>
  <div class="">
    <el-tabs v-model="activeName" :tab-position="tabpos" @tab-click="tabClick">
      <el-tab-pane
        v-for="(item) in tabsData"
        :key="item.name"
        :label="item.title"
        :name="item.name"
      >
        <component v-bind:is="whichcomp"></component>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import BaseInfo from "@/views/goods/childrenComps/BaseInfo";
export default {
  name: "",
  props: {
    // 父组件穿过来的tab数据
    tabsData: {
      type: Array,
      default() {
        return [];
      },
    },
    tabsDataInfo: {
      type: Array,
      default() {
        return [];
      },
    },
    tabpos: {
      type: String,
      default: "left",
    },
    //  父组件传递过来的tab位置
    tabtoppos: {
      type: String,
      default: "top",
    },
  },
  data() {
    return {
      activeName: "1",
      activeNameInfo: "1",
      whichcomp: "",
    };
  },
  components: {},
  created() {},
  mounted() {},
  methods: {
    tabClick(targetName, action) {
      this.$emit("tabClick");
      
      switch (targetName.label) {
        case "基本信息":
          this.whichcomp = BaseInfo;
          break;
        case "甲端本地网（资费）":
          this.whichcomp = BusinessInfo;
          break;
        case "乙端本地网（资费）":
          this.whichcomp = ChargeInfo;
          break;
        case "国内长途":
          this.whichcomp = ResouceInfo;
          break;
      }
    },
  },
};
</script>
<style scoped></style>
